<template>
  <div id="app">
    <hello :msg="famsg"></hello>
    <router-view ref="map"></router-view>
  </div>
</template>

<script>
import testpage from './components/testpage'
import map from './components/Mymap'
import hello from './components/Hello'
import { createSocket } from "./webSocket.js"
export default {
  name: 'App',
  components:{hello,map},
  data(){
    return {
      famsg: "调度系统"
    }
  },
  mounted() {
    this.init();
  },
  methods:{
    init(){
      //this.$refs.map.line(0,[{"x":444,"y":121},{"x":612,"y":110},{"x":779,"y":98},{"x":947,"y":83},{"x":1114,"y":47},{"x":1114,"y":336}]);
      createSocket('ws://127.0.0.1:8087/websocket');
      const getsocketData = e => {  // 创建接收消息函数
        var jsonObject= jQuery.parseJSON(e.detail.data);
        console.log(jsonObject["type"]);
        /*if (jsonObject[i]["type"].equals("Moveto")) {
          console.log(jsonObject[i]);
          this.$refs.map.move(jsonObject[i]["AGVid"], jsonObject[i]["Point"]);
        }*/
        switch (jsonObject["type"]){
          case "Scheduledpath":
            //console.log(jsonObject["AITlist"].length);
            for(var i=0;i<jsonObject["AITlist"].length;i++){
              this.$refs.map.line(jsonObject["AITlist"][i]["AITid"], jsonObject["AITlist"][i]["Pointarr"]);
            }
            break;

          case "AIT":
            //console.log(jsonObject["AITlist"]);
            var len=jsonObject["AITlist"].length;
            var positionObj=new Array(len);
            //localStorage.setItem("AITlist",JSON.stringify(jsonObject["AITlist"]));
            //console.log(JSON.parse(localStorage.getItem('AITlist')));
            for(var i=0;i<len;i++){
              var id=jsonObject["AITlist"][i]["id"];
              positionObj[id]=jsonObject["AITlist"][i]["position"];
            }
            this.$refs.map.initAGV(positionObj,jsonObject["AITlist"]);
            break;

          case "updateAIT":
            //console.log(jsonObject["AITlist"]);
            for(var i=0;i<jsonObject["AITlist"].length;i++) {
              this.$refs.map.move(jsonObject["AITlist"][i]["id"], jsonObject["AITlist"][i]["position"]);
            }
            this.$refs.map.updateAITDetailList(jsonObject["AITlist"]);
            break;

          default:
            console.log("todo"+ jsonObject["type"]+" : ");
            console.log(jsonObject);
        }

      };
      // 注册监听事件
      window.addEventListener('onmessageWS', getsocketData);

      // 在需要的时候卸载监听事件，比如离开页面
      //window.removeEventListener('onmessageWS', getsocketData);
    }
  }

}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>
